import {
    createRouter as _createRouter, createWebHistory, createMemoryHistory,
} from "vue-router";
import routerview from '@/components/routerview.vue'
const routes = [
    // {
    //     path: "/",
    //     redirect: () => { return { name: "About" }; }
    // },
    // { path: "/home", name: "Home", component: () => import("../views/Home.vue"), },
    {
        path: "/", 
        component: () => import("../views/About.vue"),
        // redirect: () => { return { path: "/index" }; },
        children: [
            {
                path: "/index",
                name: "index",
                component: () => import("@/views/About/index.vue"),
            },
            {
                path: "/Alerts",
                name: "Alerts",
                component: () => import("@/views/About/Alerts.vue"),
            },
            {
                path: "/Buttons",
                name: "Buttons",
                component:routerview,
                // redirect: () => { return { path: "/Buttons/index" }; },
                children:[
                    {
                        path: "/index12",
                        name: "Button_index",
                        component: () => import("@/views/About/Buttons.vue"),
                    },
                    {
                        path: "/Buttons_a",
                        name: "Button_a",
                        component: () => import("@/views/Buttons/a.vue"),
                    },
                    {
                        path: "/Buttons/:id",
                        name: "Button_b",
                        component: () => import("@/views/Buttons/b.vue"),
                    }
                ]
            },
            {
                path: "/Card",
                name: "Card",
                component: () => import("@/views/About/Card.vue"),
            },
            {
                path: "/Forms",
                name: "Forms",
                component: () => import("@/views/About/Forms.vue"),
            },
            {
                path: "/Icons",
                name: "Icons",
                component: () => import("@/views/About/Icons.vue"),
            },
            {
                path: "/SamplePage",
                name: "SamplePage",
                component: () => import("@/views/About/SamplePage.vue"),
            },
            {
                path: "/Typography",
                name: "Typography",
                component: () => import("@/views/About/Typography.vue"),
            },
        ],
    },
    { path: "/Login", name: "Login", component: () => import("@/views/About/Login.vue"), },
    { path: "/Register", name: "Register", component: () => import("@/views/About/Register.vue"), },
];

export function createRouter() {
    return _createRouter({
        history: import.meta.env.SSR ? createMemoryHistory() : createWebHistory(),
        routes,
    });
} 
